*{
    margin: 0;
    padding:0;
}
body {
    background:url(../imgs/one.jpg) no-repeat;
}
/* 最大盒子样式*/
#biggestbox {
    position: relative;
    margin: 20px auto;
    /* margin-top: 102; */
    width: 1200px;
    height: 600px;
    overflow: hidden;
    border: 2px solid black;
    background: url(../imgs/ditu1.png) left no-repeat,
                url(../imgs/ditu2.gif) right no-repeat;
    background-size: 600px;
}

/* 主角外貌样子*/
#biggestbox #lead img {
    width: 100px;

}
#biggestbox #lead .lead_blood {
    height: 20px;
    border: 1px solid red;
    background-image: linear-gradient( to right,rgba(199, 27, 27,1),rgba(199, 27, 27, .2));
}
#biggestbox #lead {
    position: absolute;
    width: 50px;
    height: 50px;
    text-align: center;
    border: 1px solid black;
    border-radius: 50px;
    /* transition: 0.1s; */
    /* overflow: hidden; */
}
#biggestbox #lead #lead_boy {
    position:absolute;
    left:-24px;
    top: -25px;
    width: 100px;
    border: 1px solid rgb(43, 255, 0);
    border-radius: 50px;
}
#biggestbox .boss_move {
    position: absolute;
    width: 50px;
    height: 50px;
    overflow: hidden;
    border: 1px solid red;
    border-radius: 50px;
}
#biggestbox .boss_move .boss_blood {
    height: 20px;
    border: 1px solid red;
    background-image: linear-gradient( to right,rgba(199, 27, 27,1),rgba(199, 27, 27, .2));
}
#biggestbox .boss_move img{
    position: absolute;
    left: -25px;
    width: 100px;
    border: 1px solid violet;
    border-radius: 100px;
}
#biggestbox {
    background-color: #666;
}
#biggestbox #lead #arms {
    position: absolute;
    left: 25px;
    top: 25px;
    display: none;
    width: 20px;
    border: 1px solid transparent;
    border-radius: 50px;
}

._arms {
    position: absolute;
    left: 25px;
    top: 25px;
    display: block;
    width: 20px;
    border: 1px solid red;
    border-radius: 50px;
}
._arms img {
    width: 20px;
}
.Laser {
    width: 30px;
}
/*游戏玩家属性*/
#box_blood {
    position: relative;
    display: none;
    margin: 20px auto;
    width: 500px;
    height: 82px;
    overflow: hidden;
    border: 2px solid black;
}
#box_blood #blood {
    display: flex;
    width: 200px;
    height: 20px;
    
    overflow: hidden;
    border: 1px solid black;
    border-radius: 5px;
}
#box_blood #blood .color {
    flex: 1;
    background-color: rgb(236, 59, 59);
}
#box_blood #blood #blood_number {
    position: absolute;
    left: 80px;
    width: 45px;
    height: auto;
    overflow: hidden;
}
#box_blood #zidan_right {
    
    margin-top: 5px;
    padding-left: 15px;
    float: right;
    width: 100px;
    height: 100px;
    /* text-align: center; */
    background-color: #666;
}
#box_blood #zidan_right img {
    position: absolute;
    /* margin-top: 5px; */
    width: 40px;
}
#box_blood #zidan_right .wen {
    font-size: 30px;
}
#box_blood #gameplayer {
    width: 200px;
    color: rgb(248, 242, 242);
    /* border: 1px solid black; */
}
#box_blood #gameplayer #playerID {
    border: 1px solid black;
    border-radius: 5px;
    color: black;
    background-color: rgb(228, 222, 222);
}
#shu {
    margin-right: 10px;
    color: white;
}
#biggestbox #box {
    position: absolute;
    left: 0;
    top: 0;
    /* display: none; */
    width: 1200px;
    height: 600px;
    background:url(../imgs/background.png) no-repeat;
    background-size: 1200px;
    border: 1px solid black;
    z-index: 5;
}
#biggestbox #box #onlod {
    position: absolute;
    left: 515px;
    top: 540px;
    width: 170px;
    height: 50px;
    border: 1px solid red;
}

/* 游戏结束后台数据*/
#geameoverbox {
    z-index: 4;
    display: none;;
    position: absolute;
    width: 1200px;
    height: 600px;
    border: 1px solid red;
    background-color: rgb(21, 112, 25);
}
#geameoverbox #gameoverdiv {
    margin: 175px auto ;
    width: 500px;
    height: 100px;
    border: 1px solid black;
}
#geameoverbox #gameoverdiv img {
    width: 500px;
}
#geameoverbox #gameoverdiv .new {
    float: left;
    margin-top: 10px;
    font-size: 20px;
    color: #fff;
    cursor: pointer;
}
#geameoverbox #gameoverdiv .see {
    float: right;
    margin-top: 10px;
    font-size: 20px;
    color: #fff;
    cursor: pointer;
}
#biggestbox #sign {
    position:absolute;
    z-index: 5;
    display: none;
    margin: 250px 450px;
    width: 300px;
    height: 100px;
    border: 1px solid black;
    background-color: rgb(4, 80, 80);
}
#biggestbox #sign #sign_down {
    margin: 35px 50px ;
    width: 200px;
    height: 30px;
    line-height: 30px;
    /* text-align: center; */
    
    
}
#biggestbox #sign #sign_down button {
    /* border: 1px solid black; */
    color: #fff;
    background-color: cadetblue;
}
#biggestbox #sign #sign_down .pleayer {
    width: 154px;
    height: 20px;
    line-height: 30px;
    color: #fff;
    border: 1px solid black;
    border-radius: 5px;
    background-color: rgb(4, 80, 80);
    outline: none;
    
}
#biggestbox #sign #sign_down .sign {
    margin-top: 2px;
    width: 198px ;
    height: 25px;
    text-align: center;
    color: #fff;
    cursor: pointer;
}
#RankingList {
    position: absolute;
    z-index: 5;
    display: none;
    width: 1200px;
    height: 600px;
   
    background:url(../imgs/xing.png) no-repeat;
    background-size: 500px;
    background-position: center center;
    background-color: rgb(6, 18, 44);
}
#RankingList #RankingListbox {
    margin: auto 450px;
    width: 300px;
    height: 600px;
    color: #fff;
    border: 1px solid red;
    /* background:url(../imgs/mu.png); */
}
#RankingList #RankingListbox .pai {
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}
#RankingList #RankingListbox .player_fen {
    display: flex;
    width: 300px;
    height: 30px;
    text-align: center;
    border: 1px solid black;
}
/* #RankingList #RankingListbox .player_fen .idone {
    float: left;
}
#RankingList #RankingListbox .player_fen .maxfenone {
    float: left;
}
#RankingList #RankingListbox .player_fen .serial_numberone {
    float: left;
} */

#RankingList #RankingListbox .player_fen .id {
    flex:1;
    float: left;
}
#RankingList #RankingListbox .player_fen .maxfen {
    flex:1;
    float: left;
}
#RankingList #RankingListbox .player_fen .serial_number {
    flex:1;
    float: left;
}
.clear {
    clear: both;
}
.blood {
    position: absolute;
    width: 20px;
}
.blood img{
    width: 20px;
}
audio {
    display: none;
    position: absolute;
    /* width: 100px;
    height: 100px; */
}
#miuc {
    z-index: 2;
    position: absolute;
    left: 50px;
    width: 10px;
}
#miuc img {
    width: 100px;
    cursor: pointer;
}
.arm {
    position:absolute;
    width: 50px;
    border: 1px solid red;
}
.arm img {
    width: 50px;
}
.first_boss {
    position: absolute;
    width: 300px;
    overflow: hidden;
    border: 1px solid red;
}
.Darts {
    position: absolute;
    width: 30px;
    border: 1px solid transparent;
    border-radius: 50px;
}
.Darts img {
    width: 30px;
}